<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:wicket="http://wicket.sourceforge.net/">
<body>
	<wicket:extend>
	<div wicket:id="tab-container">
		<ul>
           <li class="ui-tabs-nav-item"><a href="#tab-1"><span>Ajax.load</span></a></li>
     	</ul>
		<div id="tab-1">
			<p>
				Load a file by clicking the button.<br>
				A callback javascript method is executed when success.<br>
			</p>
			<span>Callback output : </span><span wicket:id="output1"></span><br/ >
			<span>File content : </span><span wicket:id="output2"></span><br/ >
			<button wicket:id="button1">Load file</button>
			<hr>
			<p>
				Load a file by clicking the button.<br>
				A callback Wicket behavior is executed when success.<br>
				This mean that you can run server side code after your ajax call.<br>
			</p>
			<span>Ajax behavior output : </span><span wicket:id="output3"></span><br/ >
			<span>File content : </span><span wicket:id="output4"></span><br/ >
			<button wicket:id="button2">Load file</button>
			<hr>
			<p>
				You can optionnaly add success javascript to the behavior
			</p>
			<span>Ajax behavior output : </span><span wicket:id="output5"></span><br/ >
			<span>File content : </span><span wicket:id="output6"></span><br/ >
			<button wicket:id="button3">Load file</button>
		</div>
	</div>
	<div class="codesample">
			<div class="codetitle">Source Code</div>
			<div class="codecontainer">
				<div class="section">
					<h5>Html</h5>
					<pre class="ln-">
						<code wicket:id="chili1" class="html"></code>
					</pre>
				</div>
				<div class="section">
					<h5>Java</h5>
					<pre class="ln-">
						<code wicket:id="chili2" class="java"></code>
					</pre>
				</div>
			</div>
		</div>
	</wicket:extend>
</body>
</html>